<template>
	<view>
		<scroll-view scroll-y class="page">
			<!-- 头部 -->
			<cu-custom bgColor="bg-rgb" :isBack="true">
				<block slot="backText">返回</block>
				<block slot="content">扫描收货</block>
			</cu-custom>
			<!-- 查询条件 -->
			<view class="fixed">
				<form>
					<view class="cu-form-group last">
						<image class="icon" src="../../static/saomiao.png" mode=""></image>
						<input auto-focus placeholder="请扫描" name="input" v-model="myFormData.oddNumber"
							@confirm="inputQuery"></input>
					</view>
					<view class="cu-form-group last">
						<view class="title">已收货数量：</view>
						<view>{{total}}</view>
					</view>	
					<view class="cu-form-group last">
						<view class="title">应收货数量：</view>
						<view>{{need}}</view>
					</view>				
					<view class="cu-form-group last">
						<view class="title">打印未收数：</view>
						<view>{{printUnreceiveNum}}<button style="display: inline;background-image: radial-gradient(circle, #354D9E, #354D9E, #697BB7);font-size: 25rpx;padding: 10rpx 5rpx;color: #FFFFFF;margin-left: 10rpx;" v-if="printUnreceiveNum!=0" @click="oneReceive">一键收货</button></view>
					</view>
				</form>
			</view>
			<view class="list">
				<view class="card animation-slide-bottom" v-for="(item,index) in list" :key="index"
					:style="[{animationDelay: (index + 1)*0.1 + 's'}]">
					<view class="top">
						<view class="left">物料编号：<text>{{item.productCode}}</text></view>
						<view class="right">{{item.inwareNum}}</view>
					</view>
					<view class="line">

					</view>
					<view class="bottom">
						<view class="box">
							<view class="lable">
								创建时间:
							</view>
							<view class="content">
								{{item.createTime}}
							</view>
						</view>
						<view class="box">
							<view class="lable">
								名称:
							</view>
							<view class="content">
								{{item.productName}}
							</view>
						</view>
					</view>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import {
		debounce
	} from '@/common/util/tools.js'
	export default {
		name: 'scanning',
		data() {
			return {
				id: '',
				myFormData: {
					oddNumber: ''
				},
				total:0,
				need:0,
				printUnreceiveNum:0,
				list: [],
				selectPurchaseId: ''
			}
		},
		onLoad(option) {
			// this.selectPurchaseId = uni.getStorageSync('selectPurchaseId')
			this.selectPurchaseId = this.$Route.query.selectPurchaseId
			this.need = this.$Route.query.purchaseNum
			console.log(11,this.selectPurchaseId)
			// this.id = uni.getStorageSync('receiveDetailId');
			// console.log("itemId:"+uni.getStorageSync('receiveBaseCode'))
			this.getMesStorageWholesaleList()
			this.queryPurchaseItemSum();
			this.queryPrintUnreceiveNum();
		},
		methods: {
			oneReceive(){
				this.printUnreceiveNum=0;
				console.log("一键收货 itemId:"+uni.getStorageSync('receiveBaseCode'))
				let data1 = {
					baseCode: uni.getStorageSync('receiveBaseCode'),
					baseRownum: this.selectPurchaseId
				}
				this.$http.get('storage/mesStorageWholesale/oneTakeDelivery', {
					params: data1
				}).then(res => {
					if (res.data.success) {
						this.modal.show({
							type: 'success',
							content: '一键收货成功'
						})
						this.getMesStorageWholesaleList()
						this.queryPurchaseItemSum()
						// this.queryPrintUnreceiveNum()	
						
					} else {
						this.modal.show({
							type: 'error',
							content: res.data.message
						})
					}
				})
			},
			// 列表查询
			getMesStorageWholesaleList() {
				uni.showLoading({
					mask: true,
					title: '加载中.....'
				})
				let data = {
					pageNo: 1,
					pageSize: 50,
					baseRownum: this.id,
					baseCode:uni.getStorageSync('receiveBaseCode'),
					baseDockettype:'扫描收货'
				}
				this.$http.get('storage/mesStorageWholesale/list', {
					params: data
				}).then(res => {
					uni.hideLoading()
					console.log("res1::", res)
					if (res.data.success) {
						 this.list = res.data.result.records;
					} else {
						// this.$tip.error(res.data.message)
						this.modal.show({
							type: 'error',
							content: res.data.message
						})
					}
				})
			},
			//根据采购订单子表查询数量
			queryPurchaseItemSum(){
				let data1 = {
					purchaseItemId: uni.getStorageSync('receiveBaseCode')
				}
				this.$http.get('storage/mesStorageWholesale/queryPurchaseItemSum', {
					params: data1
				}).then(res1 => {
					this.total  = res1.data
				})
			},
			//根据采购订单子表查询打印未收货数量
			queryPrintUnreceiveNum(){
				let data1 = {
					purchaseItemId: uni.getStorageSync('receiveBaseCode')
				}
				this.$http.get('storage/mesStorageWholesale/queryPrintUnreceiveNum', {
					params: data1
				}).then(res1 => {
					console.log("baseCode Print:"+res1.data)
					this.printUnreceiveNum  = res1.data
				})
			},
			// 扫码查询
			inputQuery: debounce(function(event, index) {
				console.log(111, this.selectPurchaseId)
				uni.showLoading({
					mask: true,
					title: '扫描收货中.....'
				})
				let data = {
					id: this.myFormData.oddNumber,
					baseCode: uni.getStorageSync('receiveBaseCode'),
					baseRownum: this.selectPurchaseId
				}
				this.$http.get('storage/mesStorageWholesale/addTakeDelivery', {
					params: data
				}).then(res => {
					uni.hideLoading()
					console.log("res2:", res)
					this.myFormData.oddNumber = '';
					if (res.data.success) {
						if(res.data.result.baseRownum){
							this.id = res.data.result.baseRownum
							this.getMesStorageWholesaleList()
						}
						if(res.data.result.baseCode){
							this.queryPurchaseItemSum();
							this.queryPrintUnreceiveNum();
						}
						this.modal.show({
							type: 'success',
							content: '扫描成功'
						})
					} else {
						this.modal.show({
							type: 'error',
							content: res.data.message
						})
					}
				})
			},1000),
			// 添加
			getMesStorageWholesaleAdd(item) {
				uni.showLoading({
					mask: true,
					title: '扫描收货中.....'
				})
				let data = item
				data.baseDockettype = '扫描收货';
				data.baseCode = uni.getStorageSync('receiveBaseCode');
				data.query4 = data.id
				data.id = '';
				data.baseRownum = this.id;
				data.createBy = ""
				data.createTime = ""
				console.log(data)
				this.$http.post('storage/mesStorageWholesale/add', data).then(res => {
					uni.hideLoading()
					console.log("res3::", res)
					this.getMesStorageWholesaleList()
					if (res.data.success) {
						// this.$tip.success(res.data.message)
						this.modal.show({
							type: 'success',
							content: res.data.message
						})
					} else {
						// this.$tip.error(res.data.message)
						this.modal.show({
							type: 'error',
							content: res.data.message
						})
					}
				})
			}
		},
	}
</script>

<style lang="less">
	page {
		background-color: #f1f1f1;

		.fixed {
			position: fixed;
			z-index: 1;
			width: 100%;
			background-color: white;
			height: 100rpx;
			border-bottom: 1rpx solid #eee;

			.last {
				border-bottom: 1rpx solid #eee;
				position: relative;

				.icon {
					width: 30rpx;
					height: 29rpx;
					position: absolute;
					top: 36rpx;
					left: 60rpx;
				}

				input {
					width: 686rpx;
					height: 68rpx;
					background: #FFFFFF;
					border: 1px solid #D5D8DF;
					border-radius: 34px;
					padding-left: 79rpx;
				}
			}
		}

		.list {
			margin-top: 410rpx;

			.card {
				margin: 30rpx;
				box-shadow: 0px 0px 5rpx 2rpx rgba(0, 0, 0, 0.1);
				border-radius: 10rpx;
				background-color: white;

				.top {
					display: flex;
					align-items: center;
					justify-content: space-between;
					// border-bottom: 20rpx solid #F0F0F0;
					// padding-bottom: 20rpx;
					font-weight: bold;
					padding: 20rpx 30rpx;

					.left {
						font-size: 28rpx;
						font-family: PingFang SC;
						font-weight: 400;
						color: #485A75;
						line-height: 50rpx;
					}

					.right {
						font-size: 28rpx;
						font-family: PingFang SC;
						font-weight: bold;
						color: #191919;
						line-height: 50rpx;
					}
				}

				.line {
					width: 750rpx;
					height: 10rpx;
					background: #F3F5F9;
				}

				.bottom {
					padding: 20rpx 30rpx;

					.box {
						display: flex;
						justify-content: space-between;
						padding: 20rpx 0;
						align-items: center;

						.lable {
							color: #485A75;
							font-size: 28rpx;
						}

						.content {
							width: 70%;
							text-align: right;
							color: #191919;
							font-weight: bold;
							word-break: break-all;
						}
					}
				}
			}
		}
	}

	// input {
	// 	border: 2rpx solid #F0F0F0;
	// 	height: 60rpx;
	// 	padding: 10rpx;
	// 	border-radius: 10rpx;
	// 	font-size: 20rpx;
	// }

	// .fixed {
	// 	position: fixed;
	// 	z-index: 1;
	// 	width: 100%;
	// 	background-color: white;
	// 	height: 100rpx;
	// 	border-bottom: 1rpx solid #eee;
	// }

	// .list {
	// 	margin-top: 120rpx;
	// }

	// .card {
	// 	margin: 30rpx;
	// 	box-shadow: 0px 0px 5rpx 2rpx rgba(0, 0, 0, 0.1);
	// 	border-radius: 10rpx;
	// 	padding: 30rpx;
	// 	background-color: white;
	// }

	// .card .top {
	// 	display: flex;
	// 	align-items: center;
	// 	justify-content: space-between;
	// 	border-bottom: 1rpx solid #F0F0F0;
	// 	padding-bottom: 20rpx;
	// 	font-weight: bold;
	// }

	// .card .bottom .box {
	// 	display: flex;
	// 	justify-content: space-between;
	// 	padding: 20rpx 0;
	// }

	// .card .bottom .box .lable {
	// 	width: 25%;
	// }

	// .card .bottom .box .content {
	// 	width: 74%;
	// 	text-align: right;
	// }
</style>
